﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<SecurityLog.Models.LogViewModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	Index
</asp:Content>


<asp:Content ContentPlaceHolderID="MainClassContent" runat="server">
    columns
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <div id="AddEntry">

        <h2>Add a new entry</h2>
    <%using (Html.BeginForm())
      { %>
        <fieldset>
            <div class="field-wrapper">
                <label for="newEntry">Log entry</label><br />
                <%= Html.TextArea("newEntry") %>
            </div>
            <div class="field-wrapper">
                <label for="category">Category:</label><br />
                <select name="Category" id="Category">
                   <% foreach(var cat in Model.CategoryList) { %>
                   <option value="<%= cat.Id %>"><%= cat.Name %></option>
                   <% } %>
               </select>
            </div>
            <div class="field-wrapper half">
                <label for="User">Initials</label><br />
                <%= Html.TextBox("User") %>
            </div>
            <div class="field-wrapper half">
                <label for="Password">Password</label><br />
                <%= Html.Password("Password") %>
            </div>
            <div class="msg">
                <%= Html.Encode(TempData["fail"]) %>
            </div>
            <div class="field-wrapper">
                <input id="btnAddLog" type="submit" value="Add entry" \ />
            </div>

        </fieldset>

    <%} %>
    </div>

    <div id="Entries">    
    
    <h2>Entries for the last 24 hours</h2>

    <ul id="log">
        <%foreach (var item in Model.Log)
          {
              string body = item.body;
              if (!string.IsNullOrEmpty(body))
              {
                  body = Html.Encode(body);
                  body.Replace("\n", "<br />");
              }
              %>
            <li>
                <p class="meta"><span class="author"><%= Html.Encode(item.userName)%></span> added <span title="<%= Html.Encode( item.dateCreated.ToShortTimeString()) %>" class="easydate"><%= Html.Encode( item.dateCreated.ToShortTimeString()) %></span></p>
                <p class="entry"><%= body %></p>
            </li>
        <%} %>
    </ul>
    </div>


    <script type="text/javascript">

        $(function () {

            var timeoutId = null;
            var updateLog = function () {

                $.getJSON("/LogView/Index", null, function (data, textStatus) {
                    $("#log").empty();
                    $(data.Log).each(function (i, item) {
                        var date = new Date(parseInt(item.dateCreated.substr(6)));
                        $("#log").append("<li><p class=\"meta\"><span class=\"author\">" + item.userName + "</span> added <span title=\"" + date + "\" class=\"easydate\">" + date + "</span></p><p class=\"entry\">" + item.body.replace(/\n/g, "<br />") + "</p></li>");
                    });
                    timeoutId = setTimeout(function () { updateLog(); }, "5000");
                    $(".easydate").easydate();
                });
            };

            updateLog();
            $("#newEntry").focus();

            $("#btnAddLog").click(function (event) {
                event.preventDefault();

                data = {
                    "newEntry": $("#newEntry").val(),
                    "User": $("#User").val(),
                    "Password": $("#Password").val(),
                    "Category": $("#Category").val()
                };

                if (data.User != "" && data.Password != "" && data.newEntry != "") {

                    $.ajax({
                        type: "POST",
                        url: "/LogView/Index",
                        data: data,
                        success: function (data) {
                            if (timeoutId != null)
                                clearTimeout(timeoutId);

                            updateLog();
                            $("#newEntry").val("");
                            $("#User").val("");
                            $("#Password").val("");
                            $("#newEntry").focus();
                        },
                        error: function (xhr, textStatus, errorThrown) {
                            alert("Error adding entry.");
                        },
                        complete: function (xhr, textStatus) {
                        }
                    });
                }
            });

        });
    
    
    </script>

</asp:Content>